<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:fn="http://java.sun.com/jsp/jstl/functions"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<ui:composition>
	<h:form id="userTableForm">
		<p:dataTable id="userTable" var="user"
			value="#{userTableBean.userList}" rowKey="#{user.id}"
			selection="#{userTableBean.selectedUser}" paginator="true"
			paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
			rows="15" rowsPerPageTemplate="5,10,15,20,30,50,100"
			selectionMode="single" editable="false">

			<p:ajax event="rowSelect" listener="#{userTableBean.onRowSelect}" />
			<p:ajax event="rowUnselect" listener="#{userTableBean.onRowUnselect}" />

			<f:facet name="header">
				<p:commandButton id="topAddCommand" value="Add New"
					icon="ui-icon-plus" update=":addUserDialogForm:addDisplayUser"
					oncomplete="addUserDialog.show()"
					disabled="#{userTableBean.addDisabled()}" style="float: left" />
				<p:tooltip for="topAddCommand" value="Add a new user"
					showEffect="#{uiConfigBean.tooltipShowEffect}"
					hideEffect="#{uiConfigBean.tooltipHideEffect}" />

				<p:commandButton id="topEditCommand" value="Edit Selected"
					icon="ui-icon-pencil" update=":editUserDialogForm:editDisplayUser"
					oncomplete="editUserDialog.show()"
					disabled="#{userTableBean.editDisabled()}" style="float: left" />
				<p:tooltip for="topEditCommand" value="Edit selected user"
					showEffect="#{uiConfigBean.tooltipShowEffect}"
					hideEffect="#{uiConfigBean.tooltipHideEffect}" />

				<p:commandButton id="topDeleteCommand" value="Delete Selected"
					icon="ui-icon-trash" update=":userTableForm:userTable"
					onclick="confirmation.show()"
					disabled="#{userTableBean.deleteDisabled()}" style="float: left" />
				<p:tooltip for="topDeleteCommand" value="Delete selected user"
					showEffect="#{uiConfigBean.tooltipShowEffect}"
					hideEffect="#{uiConfigBean.tooltipHideEffect}" />

				<h:outputText value="List of Users" />
				<h:outputText value=" (#{fn:length(userTableBean.userList)})" />
			</f:facet>

			<p:column id="usernameColumn" headerText="Username"
				filterBy="#{user.username}" filterMatchMode="contains">
				<h:outputText value="#{user.username}" />
			</p:column>

			<p:column id="passwordColumn" headerText="Password">
				<h:outputText value="#{user.passwordMask}" />
			</p:column>

			<p:column id="validPasswordColumn" headerText="Is Valid Password"
				style="width: 120px">
				<h:selectBooleanCheckbox value="#{user.validPassword}"
					disabled="true" />
			</p:column>

			<p:column id="passwordStrengthColumn" headerText="Password Strength">
				<h:outputText value="#{user.passwordStrength}%" style="float: right" />
			</p:column>

			<p:column id="roleColumn" headerText="Role">
				<h:outputText value="#{user.role.name}" />
			</p:column>

			<p:column id="activeColumn" headerText="Active" style="width: 60px">
				<h:selectBooleanCheckbox value="#{user.active}" disabled="true" />
			</p:column>

			<p:column id="createdDateColumn" headerText="Created">
				<h:outputText value="#{user.createdDate}">
					<f:convertDateTime dateStyle="medium" type="both" />
				</h:outputText>
			</p:column>

			<p:column id="updatedDateColumn" headerText="Updated">
				<h:outputText value="#{user.updatedDate}">
					<f:convertDateTime dateStyle="medium" type="both" />
				</h:outputText>
			</p:column>
		</p:dataTable>
	</h:form>

	<p:confirmDialog id="confirmDialog" appendToBody="true"
		message="Are you sure you want to delete the selected entry?"
		header="Delete Entry" severity="alert" widgetVar="confirmation">
		<h:form>
			<p:commandButton id="confirm" value="Yes"
				update=":userTableForm:userTable" oncomplete="confirmation.hide()"
				actionListener="#{userTableBean.deleteSelected}"
				icon="ui-icon-check" />
			<p:commandButton id="decline" value="No"
				onclick="confirmation.hide()" type="button" icon="ui-icon-cancel" />
		</h:form>
	</p:confirmDialog>

	<p:dialog header="Edit User Login Credentials"
		widgetVar="editUserDialog" modal="true" appendToBody="true"
		resizable="false" width="500"
		showEffect="#{uiConfigBean.dialogShowEffect}"
		hideEffect="#{uiConfigBean.dialogHideEffect}">
		<h:form id="editUserDialogForm">
			<h:panelGrid id="editDisplayUser" columns="2" cellpadding="2">
				<f:facet name="header">
					<p:graphicImage value="#{userTableBean.selectedUser.id}.png"
						style="float: left" />
				</f:facet>

				<h:outputText value="Username:" />
				<h:inputText id="username" label="username"
					value="#{userTableBean.selectedUser.username}" required="true"
					redisplay="true" size="30" />

				<h:outputText value="Password:" />
				<h:inputSecret id="password" label="password"
					value="#{userTableBean.selectedUser.password}" required="true"
					redisplay="true" size="30" />

				<h:outputText value="Role" />
				<p:selectOneMenu value="#{userTableBean.selectedUser.role}"
					required="true" effect="#{uiConfigBean.selectOneMenuShowEffect}">
					<f:converter binding="#{roleConverter}" />
					<f:selectItem itemLabel="#{userTableBean.selectedUser.role.name}"
						itemValue="#{userTableBean.selectedUser.role}" />
					<f:selectItems value="#{globalBean.roleList}" var="role"
						itemLabel="#{role.name}" itemValue="#{role}" />
				</p:selectOneMenu>

				<h:outputText value="Active:" />
				<h:selectBooleanCheckbox id="active"
					value="#{userTableBean.selectedUser.active}" label="active" />

				<p:commandButton id="updateSelected" value="Update"
					update=":userTableForm:userTable"
					action="#{userTableBean.updateSelected}"
					oncomplete="editUserDialog.hide()" icon="ui-icon-disk" />
				<p:commandButton id="cancelUpdate" value="Cancel"
					oncomplete="editUserDialog.hide()" icon="ui-icon-cancel" />
			</h:panelGrid>
		</h:form>
	</p:dialog>

	<p:dialog header="Add New User Login Credentials"
		widgetVar="addUserDialog" modal="true" appendToBody="true"
		resizable="false" width="500"
		showEffect="#{uiConfigBean.dialogShowEffect}"
		hideEffect="#{uiConfigBean.dialogHideEffect}">
		<h:form id="addUserDialogForm">
			<h:panelGrid id="addDisplayUser" columns="2" cellpadding="2">
				<f:facet name="header">
					<p:graphicImage value="#{userTableBean.newUser.id}.png"
						style="float: left" />
				</f:facet>

				<h:outputText value="Username:" />
				<h:inputText id="username" label="username"
					value="#{userTableBean.newUser.username}" required="true"
					redisplay="true" size="30" />

				<h:outputText value="Password:" />
				<h:inputSecret id="password" label="password"
					value="#{userTableBean.newUser.password}" required="true"
					redisplay="true" size="30" />

				<h:outputText value="Role" />
				<p:selectOneMenu value="#{userTableBean.newUser.role}"
					required="true" effect="#{uiConfigBean.selectOneMenuShowEffect}">
					<f:converter binding="#{roleConverter}" />
					<f:selectItem itemLabel="#{userTableBean.newUser.role.name}"
						itemValue="#{userTableBean.newUser.role}" />
					<f:selectItems value="#{globalBean.roleList}" var="role"
						itemLabel="#{role.name}" itemValue="#{role}" />
				</p:selectOneMenu>

				<h:outputText value="Active:" />
				<h:selectBooleanCheckbox id="active"
					value="#{userTableBean.newUser.active}" label="active" />

				<p:commandButton id="saveNew" value="Save"
					update=":userTableForm:userTable" action="#{userTableBean.saveNew}"
					oncomplete="addUserDialog.hide()" icon="ui-icon-disk" />
				<p:commandButton id="cancelAdd" value="Cancel"
					oncomplete="addUserDialog.hide()" icon="ui-icon-cancel" />
			</h:panelGrid>
		</h:form>
	</p:dialog>
</ui:composition>

</html>
